<template>
<div>
  <t-navbar title="修改密码" :fixed="false" left-arrow @left-click="back" />

  <div>
    <t-input disabled label="昵称" :value="user.nickName"></t-input>
    <t-input style="margin-top: 10px" disabled label="手机号" :value="user.phone"></t-input>
    <t-input style="margin-top: 10px" type="password" label="新密码" v-model="newPass1"></t-input>
    <t-input style="margin-top: 10px"  type="password" label="确认新密码" v-model="newPass2"></t-input>
    <t-button style="margin-top: 20px"  theme="light" @click="updatePass" block>修改密码</t-button>

  </div>
</div>
</template>

<script setup>
import {onMounted, ref} from 'vue'
import {Toast} from "tdesign-mobile-vue";
import {useRouter} from "vue-router";
import {post} from "../util/Request.js";


const router=useRouter()
const user=ref({
  nickName:"",
  phone:""
})
const newPass1=ref("")
const newPass2=ref("")
onMounted(()=>{
  user.value=JSON.parse(localStorage.getItem("user"))
})

const updatePass=()=>{
  if(newPass1.value==newPass2.value){
    post("user/updatepass",{password:newPass1.value}).then(r=>{
      if(r.code==0){
        //成功 跳转
        Toast("密码修改成功，重新登录！")
        router.push("/")
      }else{
        Toast(r.data)
      }
    })
  }else {
    Toast("亲，两次密码不一致！")
  }

}
const back=()=>{
  history.back()
}
</script>

<style scoped>

</style>